<template>
	<view class="content padding">
		<!-- 弹框 -->
		<u-picker :show="show" :title="title" :columns="columns" @confirm="confirm" @cancel="show=false"
			confirmColor="RGBA(255, 117, 16, 1)"></u-picker>
		<view class="padding ffffff radius flexbetween"  @click="show = true">
			<view class="titletext">申请原因</view>
			<view class="flexright">
				<view class=" margin_right3">{{thlx?thlx:"请选择申请原因"}}</view>
				<view class="icon"></view>
			</view>
		</view>
		<view class="padding ffffff radius flexbetween margin_top">
			<view class="titletext">退款金额</view>
			<view class="qianshu ">￥{{orderPrice==null?0:orderPrice}}</view>
		</view>
		<view class="padding ffffff radius margin_top">
			<view class="titletext">申请说明</view>
			<textarea v-model="content" class="textareas margin_top" placeholder="请您详细填写申请说明"></textarea>
		</view>
		  <!-- <view class="padding ffffff radius flexbetween margin_top">
			<view class="titletext">联系电话</view>
			<view class="">13768946312</view>
		</view> --> 
		<!-- 固定底部 -->
		<view class="gudingdb" >
			<view class="bigbtn" @click="tzddxq">提交申请</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				show: false,
				title:"请选择申请原因",
				thlx: "",  // 退款原因
				columns: [
					[]
				],
				
				orderID:'',// 订单id
				orderPrice:'',// 退款金额
				content:'',// 退款说明
			}
		},
		onLoad(options) {
			let _this=this
			_this.orderID=options.id
			_this.orderPrice=options.price
			_this.getOrderTklx()
		},
		methods: {
			// 跳转订单详情
			tzddxq(){
				let _this=this
				httpRequest.modal('提示', '确定提交申请吗？', true, (res) => {
					if (res) {
						if(_this.thlx==''){
							httpRequest.toast('请选择申请原因');
							return false
						}
						httpRequest.request('api/order/addApply', 'POST', {
							order_id: _this.orderID,// 订单ID
							reason: _this.thlx,// 退款原因
							refund_content: _this.content,// 退款说明
						}, false, false, true).then(res => {
							httpRequest.toast(res.msg);
							if (res.code == 1) {
								uni.navigateBack(1)
							}
						}).catch(err => {
							httpRequest.toast(err.msg);
						})
					}
				})
			},
			 // 获取订单退款理由
			getOrderTklx(){
				let _this=this
				httpRequest.request('api/order/orderTklx', 'GET', {}, false, false, true).then(res => {
					if (res.code == 1) {
						console.log(res);
						res.data.forEach(item=>{
							_this.columns[0].push(item.name)
						})
					}
				}).catch(err => {
					// httpRequest.toast(err.msg);
				})
			},
			cancel() {
				this.show = false
			},
			confirm(e) {
				this.thlx = e.value[0]
				this.show = false
			},
			// confirms(e) {
			// 	this.sqyy = e.value[0].name
			// 	this.shows = false
			// },
		}
	}
</script>

<style lang="scss" scoped>
	.notitletext{
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}
	.titletext{
		font-size: 28rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
	}
	.textareas {
		width: 100%;
		box-sizing: border-box;
	}

	.qianshu {
		font-size: 28rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: RGBA(255, 117, 16, 1);
	}

	.huisetext {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}
</style>
